<template>
  <van-config-provider :theme-vars="themeVars">
    <van-nav-bar title="账号密码登陆" left-arrow @click-left="onClickLeft" />
    <van-form @submit="onSubmit">
      <van-cell-group inset>
        <van-field
          v-model="username"
          name="用户名"
          label="用户名"
          placeholder="用户名"
          :rules="[{ required: true, message: '请填写用户名' }]"
        />
        <van-field
          v-model="password"
          type="password"
          name="密码"
          label="密码"
          placeholder="密码"
          :rules="[{ required: true, message: '请填写密码' }]"
        />
      </van-cell-group>
      <div style="margin: 16px">
        <van-button round block type="primary" native-type="submit"
          >提交</van-button
        >
      </div>
    </van-form>
  </van-config-provider>
</template>
<script setup>
import { ref } from 'vue'
import { Toast } from 'vant'
import { accountPasswordLogin } from '@/service/api/login.js'

import { useStore } from 'vuex'
const store = useStore()
import { useRouter } from 'vue-router'
const router = useRouter()

const themeVars = {
  rateIconFullColor: '#07c160',
  sliderBarHeight: '4px',
  sliderButtonWidth: '20px',
  sliderButtonHeight: '20px',
  sliderActiveBackgroundColor: '#07c160',
  buttonPrimaryBorderColor: '#DC2C1F',
  buttonPrimaryBackgroundColor: '#DC2C1F'
}

const username = ref('')
const password = ref('')
const onSubmit = async (values) => {
  console.log('submit', username.value)
  const { data: res } = await accountPasswordLogin({
    phone: username.value,
    password: password.value
  })
  if (res.code !== 200) Toast.success('服务器出错！')
  Toast.success('登录成功！')

  store.commit('login/SAVE_INFO', res.profile)
  store.commit('login/SEVE_COOKIE', res.cookie)
  localStorage.setItem('cookie', res.cookie)
  console.log(res.cookie)
  router.push('/found')
}

//页面返回
function onClickLeft() {
  console.log(1)
  router.back(-1)
}
</script>
<style></style>
